<!--60_1级行星轮系+2级平行轴-->
<template>
<div style="width: 100%;height: 100%;overflow-x:auto;overflow-y:auto">
  <div class="box1">
    <div class="box2">
      <div class="box3">
        <div style="margin-left: 5px;" class="title">
          <label>输入参数</label>
        </div>
        <div class="box4">
          <div style="width: 100%;height: 14%;display: flex;margin-top: 2%;">
            <div style="width: 25%;text-align: right;">
              <label>总传动比</label>
            </div>
            <div style="width: 15%;text-align: center;">
              <label>
                <input type="text" value="116.66" v-model="input.R0">
              </label>
            </div>
            <div style="width: 20%;">
            </div>
            <div style="width: 15%;text-align: center;">
              <label>不均载系数</label>
            </div>
            <div style="width: 15%;text-align: center;">
              <label>齿数比限制值</label>
            </div>
            <div>
              <button style="width: 25px;" @click="showModal">!</button>
              <a-modal v-model="visible" title="齿数比限制值" @ok="handleOk">
                <div>
                  <img src="@/assets/image/img_76_4.png" style="width: 100%;" alt="">
                </div>
              </a-modal>
            </div>
          </div>
          <div style="width: 100%;height: 14%;display: flex">
            <div style="width: 25%;text-align: right;">
              <label>行星轮系最大宽径比上限值</label>
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.B1min">
            </div>
            <div style="width: 5%;text-align: right;">
            </div>
            <div style="width: 15%;text-align: right;">
              6个行星轮
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.bb1">
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="3" v-model="input.aa1">
            </div>
          </div>
          <div style="width: 100%;height: 14%;display: flex">
            <div style="width: 25%;text-align: right;">
              <label>第1级平行轴宽径比上限值</label>
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.B2min">
            </div>
            <div style="width: 5%;text-align: right;">
            </div>
            <div style="width: 15%;text-align: right;">
              5个行星轮
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.bb2">
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="3.7" v-model="input.aa2">
            </div>
          </div>
          <div style="width: 100%;height: 14%;display: flex">
            <div style="width: 25%;text-align: right;">
              <label>第2级平行轴宽径比上限值</label>
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.B3min">
            </div>
            <div style="width: 5%;text-align: right;">
            </div>
            <div style="width: 15%;text-align: right;">
              4个行星轮
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.bb3">
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="5.7" v-model="input.aa3">
            </div>
          </div>
          <div style="width: 100%;height: 14%;display: flex">
            <div style="width: 25%;text-align: right;">
              <label>平行轴齿数比上限值</label>
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="7" v-model="input.ratio_parallel">
            </div>
            <div style="width: 5%;text-align: right;">
            </div>
            <div style="width: 15%;text-align: right;">
              3个行星轮
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="1" v-model="input.bb4">
            </div>
            <div style="width: 15%;text-align: center;">
              <input type="text" value="11" v-model="input.aa4">
            </div>
          </div>
          <div style="display: flex;margin-left: 30px;margin-top: 2%;">
            <div>
              <input type="text" value="1" v-model="input.ratio_D1_D2_min">
            </div>
            <div style="margin-top: 5px;margin-left: 15px;">≤</div>
            <div style="margin-top: 20px;margin-left: 10px;">
              <div style="margin-top: -24px;text-align: center">行星轮系半径</div>
                <div style="margin-top: -13px;">--------------</div>
                <div style="margin-top: -13px;">第1级平行轴外半径</div>
            </div>
            <div style="margin-left: 10px;margin-top: 5px;">≤</div>
            <div style="margin-left: 15px;">
              <input type="text" value="1.02" v-model="input.ratio_D1_D2_max">
            </div>
          </div>

        </div>
        <div style="margin-top: 1%;" align="right">
          <button style="width: 100px;" class="button" @click="m">计算</button>
        </div>
      </div>
      <div style="margin-left: 10%;width: 25%;">
        <img :src="img" alt="C" style="width: 100%;height: 100%;"/>
      </div>
    </div>
    <div style="margin-left: 5px;" class="title">
      <label>以外径最小为目标函数</label>
    </div>
    <div class="box5">
      <table>
        <tr>
          <th>行星轮系个数</th>
          <th>行星轮系齿数比</th>
          <th>第1级平行轴齿数比</th>
          <th>第2级平行轴齿数比</th>
          <th>总体积表征量</th>
          <th>行星轮系齿圈半径表征量</th>
          <th>第1级平行轴外半径表征量</th>
          <th>第2级平行轴外半径表征量</th>
          <th>行星轮系齿圈宽径比</th>
          <th>第1级平行轴小轮宽径比</th>
          <th>第2级平行轴小轮宽径比</th>
          <th>行星轮系实际最大宽径比</th>
          <th>第1平行轴实际最大宽径比</th>
          <th>第2平行轴实际最大宽径比</th>
          <th>行星轮系与第1级平行轴齿宽比</th>
          <th>第1级平行轴与第2级平行轴齿宽比</th>
        </tr>
      </table>
      <div class="box6">
          <tr v-for="(item,index) in ans.rd_matrix" :key="index">
            <td>{{item[0]}}</td>
            <td>{{item[1]}}</td>
            <td>{{item[2]}}</td>
            <td>{{item[3]}}</td>
            <td>{{item[4]}}</td>
            <td>{{item[5]}}</td>
            <td>{{item[6]}}</td>
            <td>{{item[7]}}</td>
            <td>{{item[8]}}</td>
            <td>{{item[9]}}</td>
            <td>{{item[10]}}</td>
            <td>{{item[11]}}</td>
            <td>{{item[12]}}</td>
            <td>{{item[13]}}</td>
            <td>{{item[14]}}</td>
            <td>{{item[15]}}</td>
          </tr>
      </div>
    </div>
    <div style="display: flex;width: 100%;height: 26%;">
      <div style="width: 40%;height: 100%;">
        <div style="margin-left: 5px;" class="title">
          <label>以体积最小为目标函数</label>
        </div>
        <div style="width: 100%;height: 75%;margin-left: 5px;box-shadow: 1.5px 1.5px 2px #aaaaaa;border: 0.5px solid rgba(231, 231, 231, 0.486);border-radius: 3px;">
          <table>
            <tr>
              <th style="width: 150px;text-align: center">行星轮系个数</th>
              <th style="width: 150px;text-align: center">行星轮系齿数比</th>
              <th style="width: 150px;text-align: center">第1级平行轴齿数比</th>
              <th style="width: 150px;text-align: center">第2级平行轴齿数比</th>
              <th style="width: 150px;text-align: center">总体积表征量</th>
            </tr>
          </table>
          <div class="box7">
            <tr v-for="(item,index1) in ans.rm_matrix" :key="index1">
              <td>{{item[0]}}</td>
              <td>{{item[1]}}</td>
              <td>{{item[2]}}</td>
              <td>{{item[3]}}</td>
              <td>{{item[4]}}</td>
            </tr>
          </div>
        </div>
      </div>
      <div style="margin-left: 10px;">
        <img :src="img2" alt="B" style="width: 100%;height: 100%;"/>
      </div>
    </div>

  </div>

</div>
</template>

<script>
import {o2} from "@/api/file";
export default {
  created () {
    document.title = '一级行星轮+两级平行轴传动比分配' //模块中文名
    this.$store.state.file.key = 60 //设置key为自己的页面编号
  },
name: "OptiRatio_oneplanet_add_twoparallel_last0814",
  data(){
    return{
      params_19:this.$store.state.file.dataList[60],
      s1:[],
      input:{
        bb1:"1",  //6个行星轮不均载系数
        bb2:"1",  //5个行星轮不均载系数
        bb3:"1",  //4个行星轮不均载系数
        bb4:"1",  //3个行星轮不均载系数
        aa1:"3",  //6个行星轮齿数比限制值
        aa2:"3.7",  //5个行星轮齿数比限制值
        aa3:"5.7",  //4个行星轮齿数比限制值
        aa4:"11",  //3个行星轮齿数比限制值
        R0:"116.66",  //总传动比
        B1min:"1",  //行星轮系最大宽径比上限值
        B2min:"1",  //第1级平行轴宽径比上限值
        B3min:"1",  //第2级平行轴宽径比上限值
        // B:[this.bb1,this.bb2,this.bb3,this.bb4],  //1
        // A:[this.aa1,this.aa2,this.aa3,this.aa4],  //3.7
        ratio_D1_D2_min:"1",  //行星轮系/第1级平行轴外半径比最小值
        ratio_D1_D2_max:"1.02",  //行星轮系/第1级平行轴外半径比最大值
        ratio_parallel:"7",  //平行轴齿数比上限值
      },
      visible: false,
      img:require("@/assets/image/img_60_1.jpg"),
      img2:require("@/assets/image/img_60_2.jpg"),
      /*img3:require("@/assets/image/img_60_2.jpg"),*/
      form1:{
        el:''
      },
      ans:{
        rd_matrix:[[]],
        rm_matrix:[[]]
      }
    }
  },
  methods: {
    m(){
      o2(this.input)
          .then(res=>{
            console.log(res);
          this.ans=res;
          })
          .catch(error=>{
            console.log(error);
          });
    },
    showModal() {
      this.visible = true;
    },
    handleOk(e) {
      console.log(e);
      this.visible = false;
    },
  },
}

</script>

<style scoped>
/*label{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}*/
.box1{
  width: 98%;
  height: 95%;
  margin-left: 1%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border: 0.5px solid rgba(231, 231, 231, 0.486);
  border-radius: 3px;
}
.box2{
  height: 45%;
  margin-left: 5px;
  margin-top: 5px;
  margin-right: 5px;
  display: flex;
/*  border: 1px black solid;*/
/*  background-color: #42b983;*/
}
.box3{
  width: 50%;
  height: 75%;
  margin-left: 5px;
  margin-right: 5px;
}
.box4{
  width: 100%;
  height: 100%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border: 0.5px solid rgba(231, 231, 231, 0.486);
  border-radius: 3px;
}
.box5{
  height: 25%;
  margin-left: 5px;
  margin-right: 5px;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border: 0.5px solid rgba(231, 231, 231, 0.486);
  border-radius: 3px;
}
input{
  width: 80px;
  margin-top: 2px;
  text-align: center;
}
.box6{
  margin-left: 5px;
  margin-right: 5px;
  width: 99%;
  height: 60%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border: 0.5px solid rgba(231, 231, 231, 0.486);
  border-radius: 3px;
}
.box7{
  margin-left: 5px;
  margin-right: 5px;
  width: 98%;
  height: 80%;
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border: 0.5px solid rgba(231, 231, 231, 0.486);
  border-radius: 3px;
}
.box6 td{
  width: 6.5%;
  text-align: center;
}
.box7 td{
  width: 25%;
  text-align: center;
}
.div_right_up {
  box-shadow: 1.5px 1.5px 2px #aaaaaa;
  border: 0.5px solid rgba(231, 231, 231, 0.486);
  border-radius: 3px;
}
.title {
  font-size: 17.5px;
  background-color: #D7D7D7;
  border-radius: 3px;
  padding-left: 3%;
  font-weight: bolder;
}
.button{
  background-color: #6dd400;
  border-radius: 4px;
  border: 2px #686868;
}

</style>